<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:cc="http://xmlns.jcp.org/jsf/composite"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <!-- INTERFACE -->
    <cc:interface>
        <cc:attribute name="regName"/>
        <cc:attribute name="regPass"/>
        <cc:attribute name="roles"/>
        <cc:attribute name="selectedRole"/>
        <cc:attribute name="registerAction" method-signature="void action(javax.faces.event.ActionEvent)"/>
        <cc:attribute name="registerUpdate"/>
        <cc:attribute name="registerComplete"/>
    </cc:interface>

    <!-- IMPLEMENTATION -->
    <cc:implementation>
        <p:panelGrid columns="2" id='registerPanel'>
            
            <f:facet name="header">User Data<p:growl  showDetail="true" life="3000" /></f:facet>
            <p:outputLabel for="new_user" value="User Name"/>
            <p:inputText id="new_user" value="#{cc.attrs.regName}" required="true" requiredMessage="User Name Can't be Empty"/>
            <p:outputLabel for="new_password1" value="Password"/>
            <p:password id="new_password1" value="#{cc.attrs.regPass}" required="true" match="new_password2" requiredMessage="Pasword Can't be Empty" inline="true" feedback="true"/>
            <p:outputLabel for="new_password2" value="Repeat Password"/>
            <p:password id="new_password2" value="#{cc.attrs.regPass}" required="true" requiredMessage="Pasword 2Can't be Empty" inline="true" feedback="true"/>
            <p:outputLabel for="roles" value="Select Role"/>
            <p:selectOneListbox id="roles" value="#{cc.attrs.selectedRole}" required="true" requiredMessage="Select user department" converter="deptConveter">
                <f:selectItems value="#{cc.attrs.roles}"/>
            </p:selectOneListbox>
            <f:facet name="footer">
                <p:commandButton value="register"  actionListener="#{cc.attrs.registerAction}" update="registerPanel" oncomplete="#{cc.attrs.registerComplete}"/> 
            </f:facet>
        </p:panelGrid>

    </cc:implementation>
</html>